參考資料：
Alex老師教學
PJCHENder 未整理筆記
Day12_Key Sequence Detection

偵測按鍵序列。

先抓要放入畫面的節點

const text = document.querySelector('.text'); //輸入
const ans = document.querySelector('.ans');

預設密碼和建立裝輸入內容的容器

const secretCode = 'day12'; //密碼
let keyInput = []; //使用者輸入內容

監聽鍵盤動作

window.addEventListener('keyup', e => {
    console.log(e.key,e.keyCode ,e.code);
});

把輸入內容放入陣列，並進行篩選

    keyInput.push(e.key);
    if (keyInput.length > secretCode.length) {
        // 如果輸入的長度大於密碼長度
        keyInput.shift(); // 移除陣列第1個元素，位置0
        // keyInput.splice(0,1);//效果相同
    }

比對輸入內容和預設密碼就完成了

if (keyInput.join('').includes(secretCode)) {
        // join()把陣列轉為字串，用空字串表示不分隔
        // includes()判斷使否包含預設的secretCode
        // 輸入正確時顯示
        console.log('ok');
        ans.textContent = '猜對了';
    }

完整的code

const text = document.querySelector('.text'); //輸入
const ans = document.querySelector('.ans');

const secretCode = 'day12'; //密碼
let keyInput = []; //使用者輸入內容
window.addEventListener('keyup', e => {
    // console.log(e.key, e.keyCode, e.code);
    keyInput.push(e.key);
    if (keyInput.length > secretCode.length) {
        // 如果輸入的長度大於密碼長度
        keyInput.shift(); // 移除陣列第1個元素，位置0
        // keyInput.splice(0,1);//效果相同
    }
    console.log(keyInput); //確認輸入內容
    // text.textContent = keyInput.join('');
    if (keyInput.join('').includes(secretCode)) {
        // join()把陣列轉為字串，用空字串表示不分隔
        // includes()判斷使否包含預設的secretCode
        // 輸入正確時顯示
        console.log('ok');
        ans.textContent = '猜對了';
    }
    text.textContent = keyInput.join('');
});

連結